<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
String basePath=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/";
%>
<html>
<head>
	<base href="<%=basePath%>">
<meta charset="UTF-8">

<link href="jquery/bootstrap_3.3.0/css/bootstrap.min.css" type="text/css" rel="stylesheet" />
<link href="jquery/bootstrap-datetimepicker-master/css/bootstrap-datetimepicker.min.css" type="text/css" rel="stylesheet" />

<script type="text/javascript" src="jquery/jquery-1.11.1-min.js"></script>
<script type="text/javascript" src="jquery/bootstrap_3.3.0/js/bootstrap.min.js"></script>
<script type="text/javascript" src="jquery/bootstrap-datetimepicker-master/js/bootstrap-datetimepicker.js"></script>
<script type="text/javascript" src="jquery/bootstrap-datetimepicker-master/locale/bootstrap-datetimepicker.zh-CN.js"></script>
	<script type="text/javascript" src="jquery/bs_typeahead/bootstrap3-typeahead.min.js"></script>
<script type="text/javascript">
	$(function (){
		//市场活动源
		$("#searchActivityA").click(function (){
			$("#findMarketActivity").modal("show");
			$("#activityNameTxt").focus();
		});
		$("#activityNameTxt").keyup(function (){
			var activityName=$("#activityNameTxt").val();
			$.ajax({
				url:'workbench/transaction/queryActivity.do',
				type:'post',
				data:{
					activityName:activityName
				},
				dataType:'json',
				success:function (data){
					var htmlStr="";
					$.each(data,function (index,obj){
						htmlStr+='<tr>';
						htmlStr+='	<td><input type="radio" value="'+obj.id+'" activityName="'+obj.name+'" name="activity"/></td>';
						htmlStr+='	<td>'+obj.name+'</td>';
						htmlStr+='	<td>'+obj.startDate+'</td>';
						htmlStr+='	<td>'+obj.endDate+'</td>';
						htmlStr+='	<td>'+obj.owner+'</td>';
						htmlStr+='</tr>';
					});
					$("#activityTBody").html(htmlStr);
				}
			})
		})
		//给市场活动源里的市场活动按钮添加事件
		$("#activityTBody").on("click","input[type='radio']",function (){
			//获取id 和name
			var activityId=$(this).val();
			var activityName=$(this).attr("activityName");
			$("#activityId").val(activityId);
			$("#create-activitySrc").val(activityName);
			$("#findMarketActivity").modal("hide");
		});

		//联系人名称查找
		$("#searchContactsA").click(function (){
			$("#findContacts").modal("show");
			$("#contactsNameTxt").focus();
		})
		$("#contactsNameTxt").keyup(function (){
			var contactsName=$("#contactsNameTxt").val();
			$.ajax({
				url:'workbench/transaction/queryContacts.do',
				type:'post',
				data:{
					contactsName:contactsName
				},
				dataType:'json',
				success:function (data){
					var htmlStr="";
					$.each(data,function (index,obj){
						htmlStr+='<tr>';
						htmlStr+='	<td><input value="'+obj.id+'" contactsName="'+obj.fullname+'" type="radio" name="activity"/></td>';
						htmlStr+='	<td>'+obj.fullname+'</td>';
						htmlStr+='	<td>'+obj.email+'</td>';
						htmlStr+='	<td>'+obj.mphone+'</td>';
						htmlStr+='</tr>';
					});
					$("#contactsTBody").html(htmlStr);
				}
			})
		});
		//给查找联系人里的按钮添加事件
		$("#contactsTBody").on("click","input[type='radio']",function (){
			//获取id 和name
			var contactsId=this.value;
			var contactsName=$(this).attr("contactsName");
			$("#contactsId").val(contactsId);
			$("#create-contactsName").val(contactsName);
			$("#findContacts").modal("hide");
		});

		//给阶段选择框添加 change事件
		$("#create-stage").change(function (){
			var stageName=$("#create-stage option:selected").text();

			if (stageName==''){
				$("#create-possibility").val("");
				return;
			}

			$.ajax({
				url:'workbench/transaction/getPossibilityByStage.do',
				type:'post',
				data:{
					stageName:stageName
				},
				dataType:'json',
				success:function (data){
					$("#create-possibility").val(data+'%');
				}
			})
		});
		//客户名称查询自动补全
		$("#create-customerName").typeahead({
			source:function (jquery,process){  //jquery :输入框里的值    process：需要显示的数据
				$.ajax({
					url:'workbench/transaction/queryCustomerName.do',
					type:'post',
					data:{
						customerName:jquery
					},
					dataType:'json',
					success:function (data){
						process(data);
					}
				})
			}
		});
		$("#saveCreateTranBtn").click(function (){
			//获取参数
			var owner=$("#create-owner").val();
			var money=$.trim($("#create-money").val());
			var name=$.trim($("#create-name").val());
			var expectedDate=$("#create-expectedDate").val();
			var customerName=$.trim($("#create-customerName").val());
			var stage=$("#create-stage").val();
			var type=$("#create-type").val();
			var source=$("#create-source").val();
			var activityId=$("#activityId").val();
			var contactsId=$("#contactsId").val();
			var description=$.trim($("#create-description").val());
			var contactSummary=$.trim($("#create-contactSummary").val());
			var nextContactTime=$("#create-nextContactTime").val();
			if (owner==""){
				alert("所有者不能为空")
				return;
			}
			if(name==""){
				alert("名称不能为空");
				return;
			}if (customerName==""){
				alert("客户名称不能为空");
				return;
			}if(expectedDate==""){
				alert("预计成交日期不能为空");
				return;
			}if (stage==""){
				alert("阶段不能为空");
				return;
			}
			var regExp = /^(([1-9]\d*)|0)$/;
			if (!regExp.test(money)) {
				alert("成本只能是非负整数");
				return;
			}
			$.ajax({
				url:'workbench/transaction/saveCreateTran.do',
				type:'post',
				data:{
					owner:owner,
					 money:money,
					 name:name,
					 expectedDate:expectedDate,
					 customerName:customerName,
					 stage:stage,
					 type:type,
					 source:source,
					 activityId:activityId,
					 contactsId:contactsId,
					 description:description,
					 contactSummary:contactSummary,
					 nextContactTime:nextContactTime
				},
				dataType:'json',
				success:function (data){
					if (data.code=='1'){
						window.location.href='workbench/transaction/index.do'
					}else{
						alert(data.message);
					}
				}
			})
		});

		//返回交易的Index页面
		$("#cancelBtn").click(function (){
			window.location.href='workbench/transaction/index.do';
		})

	});
</script>
</head>
<body>

	<!-- 查找市场活动 -->
	<div class="modal fade" id="findMarketActivity" role="dialog">
		<div class="modal-dialog" role="document" style="width: 80%;">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal">
						<span aria-hidden="true">×</span>
					</button>
					<h4 class="modal-title">查找市场活动</h4>
				</div>
				<div class="modal-body">
					<div class="btn-group" style="position: relative; top: 18%; left: 8px;">
						<form class="form-inline" role="form">
						  <div class="form-group has-feedback">
						    <input id="activityNameTxt" type="text" class="form-control" style="width: 300px;" placeholder="请输入市场活动名称，支持模糊查询">
						    <span class="glyphicon glyphicon-search form-control-feedback"></span>
						  </div>
						</form>
					</div>
					<table id="activityTable3" class="table table-hover" style="width: 900px; position: relative;top: 10px;">
						<thead>
							<tr style="color: #B3B3B3;">
								<td></td>
								<td>名称</td>
								<td>开始日期</td>
								<td>结束日期</td>
								<td>所有者</td>
							</tr>
						</thead>
						<tbody id="activityTBody">
<%--							<tr>--%>
<%--								<td><input type="radio" name="activity"/></td>--%>
<%--								<td>发传单</td>--%>
<%--								<td>2020-10-10</td>--%>
<%--								<td>2020-10-20</td>--%>
<%--								<td>zhangsan</td>--%>
<%--							</tr>--%>
<%--							<tr>--%>
<%--								<td><input type="radio" name="activity"/></td>--%>
<%--								<td>发传单</td>--%>
<%--								<td>2020-10-10</td>--%>
<%--								<td>2020-10-20</td>--%>
<%--								<td>zhangsan</td>--%>
<%--							</tr>--%>
						</tbody>
					</table>
				</div>
			</div>
		</div>
	</div>

	<!-- 查找联系人 -->
	<div class="modal fade" id="findContacts" role="dialog">
		<div class="modal-dialog" role="document" style="width: 80%;">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal">
						<span aria-hidden="true">×</span>
					</button>
					<h4 class="modal-title">查找联系人</h4>
				</div>
				<div class="modal-body">
					<div class="btn-group" style="position: relative; top: 18%; left: 8px;">
						<form class="form-inline" role="form">
						  <div class="form-group has-feedback">
						    <input id="contactsNameTxt" type="text" class="form-control" style="width: 300px;" placeholder="请输入联系人名称，支持模糊查询">
						    <span class="glyphicon glyphicon-search form-control-feedback"></span>
						  </div>
						</form>
					</div>
					<table id="activityTable" class="table table-hover" style="width: 900px; position: relative;top: 10px;">
						<thead>
							<tr style="color: #B3B3B3;">
								<td></td>
								<td>名称</td>
								<td>邮箱</td>
								<td>手机</td>
							</tr>
						</thead>
						<tbody id="contactsTBody">
<%--							<tr>--%>
<%--								<td><input type="radio" name="activity"/></td>--%>
<%--								<td>李四</td>--%>
<%--								<td>lisi@bjpowernode.com</td>--%>
<%--								<td>12345678901</td>--%>
<%--							</tr>--%>
<%--							<tr>--%>
<%--								<td><input type="radio" name="activity"/></td>--%>
<%--								<td>李四</td>--%>
<%--								<td>lisi@bjpowernode.com</td>--%>
<%--								<td>12345678901</td>--%>
<%--							</tr>--%>
						</tbody>
					</table>
				</div>
			</div>
		</div>
	</div>


	<div style="position:  relative; left: 30px;">
		<h3>创建交易</h3>
	  	<div style="position: relative; top: -40px; left: 70%;">
			<button type="button" class="btn btn-primary" id="saveCreateTranBtn">保存</button>
			<button type="button" class="btn btn-default" id="cancelBtn">取消</button>
		</div>
		<hr style="position: relative; top: -40px;">
	</div>
	<form class="form-horizontal" role="form" style="position: relative; top: -30px;">
		<div class="form-group">
			<label for="create-owner" class="col-sm-2 control-label">所有者<span style="font-size: 15px; color: red;">*</span></label>
			<div class="col-sm-10" style="width: 300px;">
				<select class="form-control" id="create-owner">
					<c:forEach items="${userList}" var="user">
						<option value="${user.id}">${user.name}</option>
					</c:forEach>
<%--				  <option>zhangsan</option>--%>
<%--				  <option>lisi</option>--%>
<%--				  <option>wangwu</option>--%>
				</select>
			</div>
			<label for="create-money" class="col-sm-2 control-label">金额</label>
			<div class="col-sm-10" style="width: 300px;">
				<input type="text" class="form-control" id="create-money">
			</div>
		</div>

		<div class="form-group">
			<label for="create-name" class="col-sm-2 control-label">名称<span style="font-size: 15px; color: red;">*</span></label>
			<div class="col-sm-10" style="width: 300px;">
				<input type="text" class="form-control" id="create-name">
			</div>
			<label for="create-expectedDate" class="col-sm-2 control-label">预计成交日期<span style="font-size: 15px; color: red;">*</span></label>
			<div class="col-sm-10" style="width: 300px;">
				<input type="text" class="form-control" id="create-expectedDate">
			</div>
		</div>

		<div class="form-group">
			<label for="create-customerName" class="col-sm-2 control-label">客户名称<span style="font-size: 15px; color: red;">*</span></label>
			<div class="col-sm-10" style="width: 300px;">
				<input type="text" class="form-control" id="create-customerName" placeholder="支持自动补全，输入客户不存在则新建">
			</div>
			<label for="create-stage" class="col-sm-2 control-label">阶段<span style="font-size: 15px; color: red;">*</span></label>
			<div class="col-sm-10" style="width: 300px;">
			  <select class="form-control" id="create-stage">
			  	<option></option>
				  <c:forEach items="${stageList}" var="obj">
					  <option value="${obj.id}">${obj.value}</option>
				  </c:forEach>
<%--			  	<option>资质审查</option>--%>
<%--			  	<option>需求分析</option>--%>
<%--			  	<option>价值建议</option>--%>
<%--			  	<option>确定决策者</option>--%>
<%--			  	<option>提案/报价</option>--%>
<%--			  	<option>谈判/复审</option>--%>
<%--			  	<option>成交</option>--%>
<%--			  	<option>丢失的线索</option>--%>
<%--			  	<option>因竞争丢失关闭</option>--%>
			  </select>
			</div>
		</div>

		<div class="form-group">
			<label for="create-type" class="col-sm-2 control-label">类型</label>
			<div class="col-sm-10" style="width: 300px;">
				<select class="form-control" id="create-type">
				  <option></option>
					<c:forEach items="${transactionTypeList}" var="obj">
						<option value="${obj.id}">${obj.value}</option>
					</c:forEach>
<%--				  <option>已有业务</option>--%>
<%--				  <option>新业务</option>--%>
				</select>
			</div>
			<label for="create-possibility" class="col-sm-2 control-label">可能性</label>
			<div class="col-sm-10" style="width: 300px;">
				<input type="text" class="form-control" id="create-possibility" readonly>
			</div>
		</div>

		<div class="form-group">
			<label for="create-source" class="col-sm-2 control-label">来源</label>
			<div class="col-sm-10" style="width: 300px;">
				<select class="form-control" id="create-source">
				  <option></option>
					<c:forEach items="${sourceList}" var="obj">
						<option value="${obj.id}">${obj.value}</option>
					</c:forEach>
<%--				  <option>广告</option>--%>
<%--				  <option>推销电话</option>--%>
<%--				  <option>员工介绍</option>--%>
<%--				  <option>外部介绍</option>--%>
<%--				  <option>在线商场</option>--%>
<%--				  <option>合作伙伴</option>--%>
<%--				  <option>公开媒介</option>--%>
<%--				  <option>销售邮件</option>--%>
<%--				  <option>合作伙伴研讨会</option>--%>
<%--				  <option>内部研讨会</option>--%>
<%--				  <option>交易会</option>--%>
<%--				  <option>web下载</option>--%>
<%--				  <option>web调研</option>--%>
<%--				  <option>聊天</option>--%>
				</select>
			</div>
			<label for="create-activitySrc" class="col-sm-2 control-label">市场活动源&nbsp;&nbsp;<a id="searchActivityA" ><span class="glyphicon glyphicon-search"></span></a></label>
			<div class="col-sm-10" style="width: 300px;">
				<input type="hidden" id="activityId">
				<input type="text" class="form-control" id="create-activitySrc">
			</div>
		</div>

		<div class="form-group">
			<label for="create-contactsName" class="col-sm-2 control-label">联系人名称&nbsp;&nbsp;<a id="searchContactsA" ><span class="glyphicon glyphicon-search"></span></a></label>
			<div class="col-sm-10" style="width: 300px;">
				<input type="hidden" id="contactsId">
				<input type="text" class="form-control" id="create-contactsName">
			</div>
		</div>

		<div class="form-group">
			<label for="create-description" class="col-sm-2 control-label">描述</label>
			<div class="col-sm-10" style="width: 70%;">
				<textarea class="form-control" rows="3" id="create-description"></textarea>
			</div>
		</div>

		<div class="form-group">
			<label for="create-contactSummary" class="col-sm-2 control-label">联系纪要</label>
			<div class="col-sm-10" style="width: 70%;">
				<textarea class="form-control" rows="3" id="create-contactSummary"></textarea>
			</div>
		</div>

		<div class="form-group">
			<label for="create-nextContactTime" class="col-sm-2 control-label">下次联系时间</label>
			<div class="col-sm-10" style="width: 300px;">
				<input type="text" class="form-control" id="create-nextContactTime">
			</div>
		</div>

	</form>
</body>
</html>
